import React, { Component } from 'react'
import { Table } from 'antd';

import { timestampFormat, renderSize } from '../../utils/utils'


export default class FileList extends Component {
  state = {
    selectedFileId: [],
  }
  columns = [
    {
      title: '文件名',
      dataIndex: 'name',
      width: '60%',
      render: (name, obj) =>
        <div onClick={() => this.props.clickPreview(obj.fileurl, name)}>{name}</div>,
    },
    {
      title: '大小',
      dataIndex: 'size',
      sorter: (a, b) => a.size - b.size,
      render: size =>
        <div>{renderSize(size)}</div>,
    },
    {
      title: '修改日期',
      dataIndex: 'modify_time',
      defaultSortOrder: 'descend',
      sorter: (a, b) => a.modify_time - b.modify_time,
      render: date => {
        return (   //根据时间戳生成的时间对象
          timestampFormat(date)
        )
      }
    },
  ]
  onSelectChange = (selectedFileId, info) => {
    console.log(selectedFileId)
    this.setState({ selectedFileId });
    if (selectedFileId.length > 0 && info.length > 0) {
      this.props.getSelectedId(selectedFileId, info[0].name)
    } else {
      this.props.getSelectedId(selectedFileId)
    }
  }
  render() {
    const { selectedFileId } = this.state;
    const rowSelection = {
      selectedFileId,
      onChange: this.onSelectChange,
      hideDefaultSelections: true,

    }
    return (
      <Table tableLayout="fixed" loading='true' pagination={{ position: ["bottomCenter"], hideOnSinglePage: true }} rowSelection={rowSelection} columns={this.columns} dataSource={this.props.data} />
    )
  }
}